﻿<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<html lang="zh-CN">
<head>
    <head>
        <meta charset="utf-8">
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title th:text="${article.title}"></title>
        <meta http-equiv="windows-Target " content="_top ">
        <link rel="stylesheet" type="text/css" th:href="@{/css/bootstrap.min.css}">
        <link rel="stylesheet" type="text/css" th:href="@{/css/nprogress.css}">
        <link rel="stylesheet" type="text/css" th:href="@{/css/style.css}">
        <link rel="stylesheet" type="text/css" th:href="@{/css/font-awesome.min.css}">
        <link rel="apple-touch-icon-precomposed" th:href="@{/images/icon.png}">
        <script th:src="@{/js/jquery-2.1.4.min.js}"></script>
        <script th:src="@{/js/nprogress.js}"></script>
        <script th:src="@{/js/jquery.lazyload.min.js}"></script>
        <!--[if gte IE 9]>
        <script th:src="@{/js/jquery-1.11.1.min.js}" type="text/javascript"></script>
        <script th:src="@{/js/html5shiv.min.js}" type="text/javascript"></script>
        <script th:src="@{/js/respond.min.js}" type="text/javascript"></script>
        <script th:src="@{/js/selectivizr-min.js}" type="text/javascript"></script>
        <![endif]-->
        <!--[if lt IE 9]>
        <script>window.location.href='upgrade-browser.html';</script>
        <![endif]-->
        <link rel="shortcut icon" th:href="@{http://www.muzhuangnet.com/favicon.ico}">
        <link rel="stylesheet" type="text/css" th:href="@{/css/shang.css}">
        <link rel="stylesheet" type="text/css" th:href="@{/css/vs.css}">
        <script th:src="@{/js/comm.js}"></script>
        <script type="text/javascript" charset="utf-8" th:src="@{/js/jquery.cookie.js}"></script>
        <script th:src="@{/js/highlight.pack.js}"></script>
        <script>hljs.initHighlightingOnLoad();</script>
    </head>
</head>
<body class="user-select single">
    <header class="header">
        <nav class="navbar navbar-default" id="navbar">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-navbar" aria-expanded="false"> <span class="sr-only"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
                </div>
                <div class="collapse navbar-collapse" id="header-navbar">
                    <form class="navbar-form visible-xs" action="/Search" method="post">
                        <div class="input-group">
                            <input type="text" name="keyword" class="form-control" placeholder="请输入关键字" maxlength="20" autocomplete="off">
                            <span class="input-group-btn">
                                <button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
                            </span>
                        </div>
                    </form>
                    <ul class="nav navbar-nav navbar-right">
                        <li><a data-cont="LLYNOSY博客" title="LLYNOSY博客" style="font-size:22px" href="/">首页</a></li>
                        <li th:each="tag :${allTags}"><a  th:title="${tag.cnname}" style="font-size:22px" th:href="@{|/article/tag/${tag.engname}|}" th:text="${tag.cnname}">列表页</a></li>
                        <li id="manual"><a data-cont="HTML教程" title="HTML教程" style="font-size:22px" href="/about-me" draggable="false">关于我</a></li>
                    </ul>
                </div>
            </div>
        </nav>
    </header>
    <section class="container">
      <!--  <div class="content-wrap" style="background: red">-->
            <div class="content" style="width: 80%;text-align: left;">
                <header class="article-header">
                    <h1 class="article-title"><a th:href="@{|/article/${article.id}|}" th:title="${article.title}" th:text="${article.title}"></a></h1>
                    <div class="article-meta">
                        <span class="item article-meta-time">
                            <time class="time"  data-placement="bottom" title="" ><i class="glyphicon glyphicon-time"></i> <span th:text="${article.createtime}"></span></time>
                        </span><span class="item article-meta-views"  data-placement="bottom" title="" ><i class="glyphicon glyphicon-eye-open"></i> <span th:text="${article.visits}"></span></span> <span class="item article-meta-comment"  data-placement="bottom" title="" ><i class="glyphicon glyphicon-comment"></i> <span th:text="${article.comment}"></span></span>
                    </div>
                </header>
                <article class="article-content" >
                    <div th:utext="${article.content}"></div>
                    <p class="article-copyright hidden-xs">转载请注明出处：<a title="LLYNOSY博客" href="http://www.llynosy.com/" draggable="false">LLYNOSY博客</a> » <a th:href="@{|http://www.llynosy.com/article/${article.id}|}" th:title="${article.title}" draggable="false"><spanp th:text="${article.title}"></spanp></a></p>
                </article>

                <div class="article-shang">
                    <p>
                        <a href="javascript:void(0)" rel="nofollow" style="color: #fff" onclick="dashangToggle()" class="dashang" title="打赏，支持一下" draggable="false">打赏</a>
                    </p>
                </div>
                <div class="hide_box">
                </div>
                <div class="shang_box">
                    <a class="shang_close" href="javascript:void(0)" onclick="dashangToggle()" title="关闭" draggable="false">
                        <img src="/images/close.jpg" alt="取消" draggable="false">
                    </a>
                    <img class="shang_logo" src="http://www.muzhuangnet.com/upload/201610/17/201610171329086541.png" alt="木庄网络博客" draggable="false">
                    <div class="shang_tit">
                        <p>
                            感谢您的支持，我会继续努力的!
                        </p>
                    </div>
                    <div class="shang_payimg">
                        <img src="/static/images/alipayimg-1.jpg" alt="扫码支持" title="扫一扫" draggable="false">
                    </div>
                    <div class="pay_explain">
                        扫码打赏，您说多少就多少
                    </div>
                    <div class="shang_payselect">
                        <div class="pay_item checked" data-id="alipay">
                            <span class="radiobox"></span><span class="pay_logo">
                                <img src="../static/images/alipay-1.jpg" alt="支付宝" draggable="false">
                            </span>
                        </div>
                        <div class="pay_item" data-id="weipay">
                            <span class="radiobox"></span><span class="pay_logo">
                                <img src="/static/images/wechat-1.jpg" alt="微信" draggable="false">
                            </span>
                        </div>
                    </div>
                    <div class="shang_info">
                        <p>
                            打开<span id="shang_pay_txt">支付宝</span>扫一扫，即可进行扫码打赏哦
                        </p>
                        <p>
                            分享从这里开始，精彩与您同在
                        </p>
                    </div>
                </div>
                <div class="relates">
                    <div class="title">
                        <h3>相关推荐</h3>
                    </div>
                    <ul>
                        <li th:each="relateArticle:${relateArticleList}"><a th:href="@{|/article/${relateArticle.id}|}"  th:title="${relateArticle.title}"><span th:text="${relateArticle.title}"></span></a></li>

                    </ul>
                </div>
                <div class="title" id="comment">
                    <h3>评论</h3>
                </div>
                <div id="respond">
                    <form id="comment-form" name="comment-form" action="" method="POST">
                        <div class="comment">
                            <input name="" id="" class="form-control" size="22" placeholder="您的昵称（必填）" maxlength="15" autocomplete="off" tabindex="1" type="text">
                            <input name="" id="" class="form-control" size="22" placeholder="您的网址或邮箱（非必填）" maxlength="58" autocomplete="off" tabindex="2" type="text">
                            <div class="comment-box">
                                <textarea placeholder="您的评论或留言（必填）" name="comment-textarea" id="comment-textarea" cols="100%" rows="3" tabindex="3"></textarea>
                                <div class="comment-ctrl">
                                    <div class="comment-prompt" style="display: none;"> <i class="fa fa-spin fa-circle-o-notch"></i> <span class="comment-prompt-text">评论正在提交中...请稍后</span> </div>
                                    <div class="comment-success" style="display: none;"> <i class="fa fa-check"></i> <span class="comment-prompt-text">评论提交成功...</span> </div>
                                    <button type="submit" name="comment-submit" id="comment-submit" tabindex="4">评论</button>
                                </div>
                            </div>
                        </div>
                    </form>

                </div>
                <div id="postcomments">
                    <ol id="comment_list" class="commentlist">
                        <li class="comment-content" th:each="comment :${comments}"><span class="comment-f">#2</span><div class="comment-main"><p><a class="address" href="http://www.muzhuangnet.com/" rel="nofollow" target="_blank"><span th:text="${comment.nickname}"></span></a><span class="time"><span th:text="${comment.createtime}"></span></span><br><p th:text="${comment.content}"></p></p></div></li>
                    </ol>
                </div>
            </div>
       <!-- </div>-->
    </section>
    <footer class="footer">
        <div class="container">
            <p>本站[<a href="http://www.llynosy.com/">LLYNOSY博客]</a>&nbsp;Powered By LLYNOSY&nbsp; &nbsp; </p>
        </div>
        <div id="gotop"><a class="gotop"></a></div>
    </footer>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/jquery.ias.js}"></script>
    <script th:src="@{/js/scripts.js}"></script>

</body>
</html>
